<!DOCTYPE HTML>
<html>
<head>
<title>About</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all">
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Solutem Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<script src="js/jquery-1.11.1.min.js"></script>
<!---- start-smoth-scrolling---->
<script type="text/javascript" src="js/move-top.js"></script>
<script type="text/javascript" src="js/easing.js"></script>
 <script type="text/javascript">
		jQuery(document).ready(function($) {
			$(".scroll").click(function(event){		
				event.preventDefault();
				$('html,body').animate({scrollTop:$(this.hash).offset().top},1200);
			});
		});
	</script>
<!---End-smoth-scrolling---->
<link href="css/component.css" rel="stylesheet" type="text/css"  />
<script src="js/modernizr.custom.js"></script>
</head>
<body class="cbp-spmenu-push">
	<!--header-banner-->
	<div class="header-banner">
		<div class="banner-grids">
			<div class="baneer-grid1">
			</div>
			<div class="baneer-grid2">
			</div>
			<div class="baneer-grid3">	
			</div>
			<div class="baneer-grid4">
			</div>
			<div class="baneer-grid5">
			</div>
			<div class="baneer-grid6">
			</div>
			<div class="clearfix"></div>
		</div>
		<div class="top-header">
			<div class="container">
				<div class="logo">
					<a href="index.html">Solutem</a>
				</div>
				<div class="top-nav">
						<nav class="cbp-spmenu cbp-spmenu-vertical cbp-spmenu-right" id="cbp-spmenu-s2">
							<h3>Menu</h3>
							<a href="index.html">home</a>
							<a href="about.html" class="active">about</a>
							<a href="services.html">services</a>
							<a href="gallery.html">gallery</a>
							<a href="typo.html">typo</a>
							<a href="contact.html">contact</a>
						</nav>
						<div class="main buttonset">	
								<!-- Class "cbp-spmenu-open" gets applied to menu and "cbp-spmenu-push-toleft" or "cbp-spmenu-push-toright" to the body -->
								<button id="showRightPush"><img src="images/menu-icon.png" alt=""/></button>
								<!--<span class="menu"></span>-->
						</div>
						<!-- Classie - class helper functions by @desandro https://github.com/desandro/classie -->
						<script src="js/classie.js"></script>
						<script>
							var menuRight = document.getElementById( 'cbp-spmenu-s2' ),
							showRightPush = document.getElementById( 'showRightPush' ),
							body = document.body;

							showRightPush.onclick = function() {
								classie.toggle( this, 'active' );
								classie.toggle( body, 'cbp-spmenu-push-toleft' );
								classie.toggle( menuRight, 'cbp-spmenu-open' );
								disableOther( 'showRightPush' );
							};

							function disableOther( button ) {
								if( button !== 'showRightPush' ) {
									classie.toggle( showRightPush, 'disabled' );
								}
							}
						</script>
						<!-- /script-for-menu -->
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
	<!--end-header-->
		<div class="content">
				<div class="whoweare">
					<div class="container">
						<h3>who we are</h3>
							<div class="whoweare-grids">
								<div class="col-md-7 whoweare-grid">
						<iframe src="//player.vimeo.com/video/21790809" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
									<h4>Let’s build the world without child abuse and neglect !</h4>
									<p>Fusce euismod consequat ante. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Pellentesque sed dolor. Aliquam congue fermentum nisl. Mauris accumsan nulla vel diam. Sed in lacus ut enim adipiscing aliquet. Nulla venenatis. In pede mi, aliquet sit amet, euismod in, auctor ut, ligula. Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem. Vestibulum sed ante.</p>
									<P>Praesent faucibus rutrum odio at rhoncus. Pellentesque vitae tortor id neque fermentum pretium. Maecenas ac lacus ut neque rhoncus laoreet sed id tellus. Donec justo tellus, tincidunt vitae pellentesque nec, pharetra a orci. Praesent nunc nunc, egestas eget elementum sed; rutrum eget metus! Vestibulum congue congue dui ut porta.</P>
								</div>
								<div class="col-md-5 whoweare-grid1">
									<h3>Our history</h3>
									<div class="history">
										<div class="hist-year">
										<h5>1998:</h5>
										</div>
										<div class="hist-text">
										<P>cum sociis natoque penabus et magnis dis part urie nt montes, nascetur ridiculus mus. Nulla du i. Fusce feugiat malesuada odio. Present vesti bulum aene an nonu</P>
										</div>
										<div class="clearfix"></div>
									</div>
									<div class="history">
										<div class="hist-year">
										<h5>2005:</h5>
										</div>
										<div class="hist-text">
										<P>cum sociis natoque penabus et magnis dis part urie nt montes, nascetur ridiculus mus. Nulla du i. Fusce feugiat malesuada odio. Present vesti bulum aene an nonu</P>
										</div>
										<div class="clearfix"></div>
									</div>
									<div class="history">
										<div class="hist-year">
										<h5>2007:</h5>
										</div>
										<div class="hist-text">
										<P>cum sociis natoque penabus et magnis dis part urie nt montes, nascetur ridiculus mus. Nulla du i. Fusce feugiat malesuada odio. Present vesti bulum aene an nonu</P>
										</div>
										<div class="clearfix"></div>
									</div>
									<div class="history">
										<div class="hist-year">
										<h5>2010:</h5>
										</div>
										<div class="hist-text">
										<P>cum sociis natoque penabus et magnis dis part urie nt montes, nascetur ridiculus mus. Nulla du i. Fusce feugiat malesuada odio. Present vesti bulum aene an nonu</P>
										</div>
										<div class="clearfix"></div>
									</div>
									<div class="history">
										<div class="hist-year">
										<h5>2014:</h5>
										</div>
										<div class="hist-text">
										<P>cum sociis natoque penabus et magnis dis part urie nt montes, nascetur ridiculus mus. Nulla du i. Fusce feugiat malesuada odio. Present vesti bulum aene an nonu</P>
										</div>
										<div class="clearfix"></div>
									</div>
								</div>
								<div class="clearfix"></div>
							</div>
					</div>
				</div>
				<!--team-->
			<div class="team">
				<div class="container">
				<h3>Our Team Members</h3>
				<div class="team-info">
					<div class="col-md-3 team-grids">
						<a href="#">
							<img class="img-responsive" src="images/t1.jpg" alt="">
							<div class="captn">
								<h4>Tincidun</h4>
								<p>Aenean pulvinar ac enimet posuere tincidunt velit Utin tincidunt</p>
							</div>
						</a>
					</div>					
					<div class="col-md-3 team-grids">
						<a href="#">
							<img class="img-responsive" src="images/t2.jpg" alt="">
							<div class="captn">
								<h4>Velit uti</h4>
								<p>Aenean pulvinar ac enimet posuere tincidunt velit Utin tincidunt</p>
							</div>
						</a>
					</div>
					<div class="col-md-3 team-grids">
						<a href="#">
							<img class="img-responsive" src="images/t3.jpg" alt="">
							<div class="captn">
								<h4>Posuere</h4>
								<p>Aenean pulvinar ac enimet posuere tincidunt velit Utin tincidunt</p>
							</div>
						</a>
					</div>
					<div class="col-md-3 team-grids">
						<a href="#">
							<img class="img-responsive" src="images/t4.jpg" alt="">
							<div class="captn">
								<h4>Augc sfe</h4>
								<p>Aenean pulvinar ac enimet posuere tincidunt velit Utin tincidunt</p>
							</div>
						</a>
					</div>
					<div class="clearfix"> </div>
				</div>
			</div>
			</div>
			<!--//team-->
				<div class="why-choose">
					<div class="container">
						<h3>Why Choose Us ?</h3>
						<div class="choose-grids">
							<div class="col-md-4 choose-grid">
							<h4>1. Vestibulum iaculis</h4>
						 <p>Mauris asan nulla vel diam. Sed in lacus ut enim adipiscing aliquetulla venenat pede mi, aliquet sit amet, euismod in, auctor ut, ligula. Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis, lobortis dignissim.</p>

							</div>
							<div class="col-md-4 choose-grid">
							<h4>2. Mauris asan nulla</h4>
						 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing ellente ssed dololiquam congu fermentum nisl. Mauris asan nulla vel diam. Sed in lacus ut enim adipiscing aliquetulla venenat pede mi, aliquet sit amet, euismod in, auctor ut.</p>

							</div>
							<div class="col-md-4 choose-grid">
							<h4>3. faucibus risus</h4>
						 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing ellente ssed dololiquam congu fermentum nisl. Mauris asan nulla vel diam. Sed in lacus ut enim adipiscing aliquetulla venenat pede mi, aliquet sit amet, euismod in, auctor ut.</p>

							</div>
							<div class="clearfix"></div>
							</div>
						</div>	
					</div>

			</div>
			<div class="footer-section">
						<div class="container">
							<div class="footer-top">
						<p>Copyright &copy; 2015.Company name All rights reserved.More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> - Collect from <a href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></p>
									</div>
							<script type="text/javascript">
						$(document).ready(function() {
							/*
							var defaults = {
					  			containerID: 'toTop', // fading element id
								containerHoverID: 'toTopHover', // fading element hover id
								scrollSpeed: 1200,
								easingType: 'linear' 
					 		};
							*/
							
							$().UItoTop({ easingType: 'easeOutQuart' });
							
						});
					</script>
				<a href="#" id="toTop" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>
				</div>
			</div>


				

</body>
</html> 